<template>
	<view>
		<view class="items box-shadow u-font-32" v-for="(item,index) in list" :key="index">
			<view class="u-flex u-row-between">
				<view class="u-flex">
					<u-icon name="chat" class="color-yellow" size="42"></u-icon>
					<text class="u-m-l-12 color-yellow">订单消息</text>
				</view>
				<view class="color-gary-xs">{{item.createDate}}</view>
			</view>
			<view class="u-p-t-18 u-p-b-10">{{item.remindContent}}</view>
		</view>

		<view class="kong" v-if="list.length===0">
			<u-empty text="暂无消息" mode="message"></u-empty>
		</view>

		<tarBar></tarBar>
	</view>
</template>

<script setup lang="ts">
	import newsApi from '@/api/news';
	import { onShow, onReachBottom } from '@dcloudio/uni-app'
	import { reactive, ref } from "vue";
	import userSotre from '@/store/user';
	const userPinia = userSotre()
	const params = reactive({
		pageNo: 1,
		pageSize: 10
	})

	const list = ref([])

	const getList = (type = "") => {
		if (type === 'reset') {
			list.value = []
			params.pageNo = 1
		}
		newsApi.getNewsList(params).then(res => {
			if (res.data.total > list.value) {
				list.value.push(...res.data.list)
				params.pageNo++
			}
		})
	}

	onShow(() => {
		if (userPinia.isLoginType != 0) {
			getList()
		}
	})
	onReachBottom(() => {

		getList()
	})
</script>

<style>
	page {
		background-color: #f3f3f3;
	}
</style>
<style lang="scss" scoped>
	.kong {
		width: 100vw;
		height: 80vh;
	}

	.items {
		margin: 38upx 30upx;
		padding: 18upx 26upx;
		border-radius: 12upx;
		background-color: white;
	}
</style>
